<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="../js/jquery-3.4.1.min.js"></script>
        <script>
            // window.onload=function(){
            //     //获取所有input标签的集合
            //     var inputs=document.getElementsByTagName("input");
            //
            //     //获取图片的DOM对象
            //     var img=document.querySelector("img");
            //     for(var i=0;i<inputs.length;i++){
            //         inputs[i].onclick=function(){
            //             img.src="../images/"+this.value;
            //         };
            //     }
            // };

            $(function(){
                $("input").click(function(){
                    $("img").attr("src","../images/"+$(this).val());
                });
            });
        </script>
    </head>
    <body>
        <input type="radio" value="mi.png" name="idol" id="mi" checked>
        <label for="mi">杨幂</label>
        <input type="radio" value="yan.png" name="idol" id="yan">
        <label for="yan">唐嫣</label>
        <input type="radio" value="shi.png" name="idol" id="shi">
        <label for="shi">刘诗诗</label>
        <div>
            <img src="../images/mi.png" alt="">
        </div>
    </body>
</html>